html,body,div,p,a,span,img{
	padding: 0;
	margin: 0;
	font-size: 14px;
}
@mixin trans($type:all){
	transition: $type linear .3s;
	-moz-transition: $type linear .3s; 
	-webkit-transition: $type linear .3s; 
	-o-transition: $type linear .3s;
}
  .hz-mask{
  	position: fixed;
  	top: 0%;
  	left: 0%;
  	right: 0;
  	bottom: 0;
  	width: 100%;
  	height: 100%;
  	background: #000;
  	opacity: 0.5;
  	z-index: 999;
  	cursor: pointer;
  	overflow: hidden;
  	@include trans();
  
  }
  .hz-modal{
  	position: fixed;
  	width: 480px;
  	top: 50%;
  	left: 50%;
  	margin: auto;
  	padding: 20px 30px;
  	border-radius: 20px;
  	background: #fff;
  	box-shadow: 0 0 6px #ccc;
  	-moz-transform: translate(-50%,-50%);
  	-webkit-transform:translate(-50%,-50%) ;
  	transform: translate(-50%,-50%);
  	z-index: 1001;
  	box-sizing: border-box; 	
  	@include trans(); 
  	.modal-body{
  		margin: 10px 0;
  		text-align:center;
  		img.icon{
	  		width: 70px;
	  		height: 70px;
	  		display: inline-block;
	  		margin: 20px auto;
	  	}
  	   p{
  	   		font-size: 16px;
  		    line-height: 24px;
	  		text-align: center;	
	  	}
  	}
  	.modal-foot{
  		margin: 20px 0 0;
  		width: 100%;
  		display: flex;
  		justify-content: center;
  		.btn{
  			display: inline-block;
  			min-width: 60px;
  			text-align: center;
	  		border-radius: 6px;
	  		height: 32px;
	  		line-height: 32px;
	  		padding: 0 8px;
	  		cursor: pointer;
	  		margin: 0 15px;
	  		&.cancel-btn{
	  			border: 1px solid #ddd;
	  		}
	  		&.confirm-btn{
	  			background: #5850ec;
	  			color: #fff;
	  		}
	  	}
  	}
  	
  }